<template>
    <!--  社区公告/热门问题/使用指南/网站条款-->
    <div class="container">
      <el-collapse v-model="activeNames" @change="handleChange" height="600">
        <el-collapse-item title="服务条款" name="1">
          <div v-html="numbertext.text_1"></div>
        </el-collapse-item>
        <el-collapse-item title="隐私政策" name="2">
          <div v-html="numbertext.text_2"></div>
        </el-collapse-item>
        <el-collapse-item title="免责声明" name="3">
          <div v-html="numbertext.text_3"></div>
        </el-collapse-item>
        <el-collapse-item title="平台风险警示" name="4">
          <div v-html="numbertext.text_4"></div>
        </el-collapse-item>
        <el-collapse-item title="社区基本守则" name="5">
          <div v-html="numbertext.text_5"></div>
        </el-collapse-item>
      </el-collapse>
    </div>
    </template>

<script>
import { numberApi } from '@/api/index';
export default {
  name: 'noticeIndex',
  data () {
    return {
      activeNames: [''],
      numbertext: [],
    }
  },
  created() {
    this.getNumbertext()
  },
  methods: {
    handleChange (val) {
      console.log(val)
    },
       //获取文本
       getNumbertext() {
      numberApi().then(res => {
        console.log(res.data.data, '行情文本')
        this.numbertext = res.data.data
      })
    }
  }
}
</script>

    <style scoped lang="scss">
    .container {
      background-color: #ffffff;
      padding: 20px 10px;
      margin: 0 150px 0;
      min-height: 450px;
      margin-bottom: 80px;
    }
    ::v-deep .el-collapse-item__content {
      text-align: left !important;
      background-color: white;
      height: 600;
    }
    ::v-deep .el-collapse-item__header {
      font-size: 13px;
    }
    ::v-deep .el-collapse-item {
      font-size: 18px;
      border-bottom: 1px solid rgba($color: gray, $alpha: 0.1);
      padding-left: 10px;
    }
    </style>
